<script setup>
import {ref,computed} from 'vue'
import NavBar from '../../components/nav-bar'
import FormItem from '../../components/form-item.vue'
import { onShow } from '@dcloudio/uni-app';
const taskList = ref(['抖音探店','快手探店','小红书探店','大众探店','火山探店','B站探店','微博探店'])
const taskIndex = ref(0)
const bindPickerChange = (e) => {
	taskIndex.value = e.detail.value
}
const date = ref(null)
const startDate = computed(() => {
	return getDate('start')
})
const endDate = computed(() => {
	return getDate('end')
})
const getDate = (type) => {
	const date = new Date()
	let year = date.getFullYear()
	let month = date.getMonth() + 1
	let day = date.getDate()

	if (type === 'start') {
		year = year - 60
	} else if (type === 'end') {
		year = year + 2
	}
	month = month > 9 ? month : '0' + month
	day = day > 9 ? day : '0' + day
	return `${year}-${month}-${day}`
}
date.value = getDate()
const  bindDateChange = (e) => {
	date.value = e.detail.value
}
const servicePrice = ref(0)
const totalPrice = ref(0)
function formSubmit(e) {
	if(!uni.getStorageSync('mid')) {
		uni.showToast({
			title: '请您先登录',
			icon:'none',
			duration: 2000
		});
	}
}
onShow(()=> {
	console.log('我是publish页')
	if(uni.getStorageSync('mid')) {
		const mid = uni.getStorageSync('mid')
		uni.request({
			url:'',
			data:{
				mid:mid
			},
			method:'POST',
			header:{
				 'content-Type':'application/x-www-form-urlencoded '
			},
			success: (res) => {
				if(res) {
					//验证用户是否注册成为商家
				}
			}
		})
		uni.showModal({
			title:'提示',
			content:'您未注册成为商家,无法发布需求!',
			showCancel:false,
			success:()=> {
				uni.switchTab({
					url:'../home/home'
				})
			}
		})
	}
	else {
		uni.showModal({
			title:'提示',
			content:'请先登录',
			showCancel:false,
			success:()=> {
				uni.switchTab({
					url:'../home/home'
				})
			}
		})
	}
})
</script>

<template>
  <view class="publish-content">
    <NavBar title="发布任务" />
	<view class="form-card">
		<form @submit="formSubmit">
			<form-item title="任务分类" haveSlot>
				<picker @change="bindPickerChange" :value="taskIndex" :range="taskList">
					<view style="color:#a1a1a1;">{{taskList[taskIndex]}}</view>
				</picker>
			</form-item>
			<form-item title="分类介绍" name="category" placeholder="" disable :value="taskList[taskIndex]"></form-item>
			<form-item title="任务简介" placeholder="请输入任务简介"></form-item>
			<form-item title="任务标题" name="title" placeholder="请输入任务标题"></form-item>
			<form-item title="任务单价" name="unitPrice" placeholder="请输入任务单价"></form-item>
			<form-item title="任务数量" name="taskNumber" placeholder="请输入任务数量"></form-item>
			<form-item title="人均次数" name="personNumber" placeholder="请输入领取次数" value=1></form-item>
			<form-item title="任务总价" name="totalPrice" value=0></form-item>
			<form-item title="链接信息" name="link" placeholder="请输入链接地址"></form-item>
			<form-item title="任务步骤" name="step" placeholder="简单易懂的步骤有助于完成!"></form-item>
			<form-item title="收集信息" name="gather" placeholder="需要提交的其他信息,如微信"></form-item>
			<form-item title="截止日期" name="deadline" haveSlot>
				<picker mode="date" @change="bindDateChange" :value="date" :start="startDate" :end="endDate">
					<view style="color:#a1a1a1;">{{date}}</view>
				</picker>
			</form-item>
			<form-item title="审核例图" name="photo" placeholder="最多只能上传三张"></form-item>
			<view class="charge">平台手续费 <text>{{servicePrice}}</text> 元</view>
			<view class="charge">本次发布需支付 <text>{{totalPrice}}</text> 元</view>
		</form>
	</view>
    <view class="bottom-button">
    	<button >立即发布</button>
    </view>
  </view>
</template>

<style lang="scss">
.bottom-button {
	position: fixed;
	width: 100%;
	height: 88rpx;
	bottom: 0;
	left: 0;
	button {
		background-color: #faca2a;
		height: 88rpx;
		line-height: 88rpx;
		font-size: 16px;
		border-radius: 0;
	}
}
.charge{
	padding: 10rpx 20rpx 5rpx;
	font-size: 14px;
	color: #a1a1a1;
	text {
		font-weight: bold;
		color: #faca2a;
	}
}
</style>